<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix text-left">
        <el-col :span="23">
          <span class="title-icon">货物到仓</span>
        </el-col>
      </div>
      <el-row style="margin-top: 20px; margin-bottom: 20px; margin-left: 50px">
        <el-col :span="2">
          <span>箱号:</span>
        </el-col>
        <el-col :span="6">
          <el-input
            size="mini"
            v-model.trim="boxNo"
            placeholder="输入完敲回车查询箱号"
            @keyup.enter.native="queryAndprintWaybillLabel"
          ></el-input>
        </el-col>
        <el-col :span="4" style="margin-left: 10px">
          <el-button
            size="mini"
            type="primary"
            @click="queryAndprintWaybillLabel"
            >查询</el-button
          >
        </el-col>
      </el-row>
      <el-row style="margin-top: 20px; margin-bottom: 20px; margin-left: 50px">
        <el-col :span="2">
          <span>到仓件数:</span>
        </el-col>
        <el-col :span="6">
          <el-input
            size="mini"
            :rows="5"
            v-model.trim="arrivalTotalPackages"
            placeholder="输入件数"
          ></el-input>
        </el-col>
      </el-row>
      <el-row style="margin-top: 20px; margin-bottom: 20px; margin-left: 50px">
        <el-col :span="2">
          <span>仓库:</span>
        </el-col>
        <el-col :span="6">
            <div slot="label">仓库：</div>
            <el-select
              v-model="storageLocation"
              filterable
              size="mini"
              placeholder="请选择仓库"
            >
              <el-option
                v-for="(item, value) in storageLocationMap"
                :key="value"
                :label="item"
                :value="Number(value)"
              />
            </el-select>
        </el-col>
      </el-row>
      <el-row style="margin-top: 20px; margin-bottom: 20px; margin-left: 50px">
        <el-col :span="2">
          <span>库区:</span>
        </el-col>
        <el-col :span="6">
          <el-input
            size="mini"
            :rows="5"
            v-model.trim="warehouseParam.number"
            placeholder=""
          ></el-input>
        </el-col>
        <el-col :span="4" style="margin-left: 10px">
          <el-button
            size="mini"
            type="primary"
            @click="saveArrivalTotalPackages"
            >保存</el-button
          >
        </el-col>
      </el-row>
    </el-card>
    <el-card class="padding margin-top info-box">
      <el-row>
        <el-col :span="4">
          <span>运单号:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ waybillNo }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>库区:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ reservoirAreaShow }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>客户:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>入库渠道:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ inStockName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>客户下单件数:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerCount }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>到仓件数:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ arrivalPackages }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>报关方式:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerWay }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>订单状态:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ statusName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>销售:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ saleName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>耗时（毫秒）:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ time }}</span>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>
<script>
import { ajax } from "@/store/yg/common/utils";
import axios from "axios";
import * as constant from "@/store/yg/common/constant";
import { m } from "@/store/yg/common/local";
import {Toast} from "mint-ui";

export default {
  components: {},
  props: [],
  data() {
    return {
      boxNo: "",
      arrivalTotalPackages: "",
      waybillNo: "",
      customerName: "",
      inStockName: "",
      customerCount: "",
      arrivalPackages: "",
      customerWay: "",
      statusName: "",
      saleName: "",
      time: "",
      waybillId: "",
      reservoirAreaShow: "",
      storageLocation: "",
      storageLocationMap: {},
      warehouseParam: {
        number: ""
      }
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.initStorageLocations();
  },
  methods: {
    initStorageLocations: function() {
      ajax("storageLocations", {}).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            this.storageLocationMap = res.data;
            this.storageLocation = res.data2;
          }else {
            if (res.message){
              this.$message.error(res.message);
            }else{
              this.$message.error("操作失败");
            }
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    queryAndprintWaybillLabel() {
      if (!this.boxNo) {
        this.$message.error("请输入箱号");
        return;
      }
      if (this.boxNo.length<6) {
        this.$message.error("请输入正确的箱号");
        return;
      }
      ajax("doCargoTrace", { boxNo: this.boxNo, isPrint: false }).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            var data = res.data;
            this.waybillNo = data.waybillNo;
            this.customerName = data.customerName;
            this.inStockName = data.inStockName;
            this.customerCount = data.customerCount;
            this.arrivalPackages = data.arrivalPackages;
            this.customerWay = data.customerWay;
            this.statusName = m(data.statusName);
            this.saleName = data.saleName;
            this.time = data.time;
            this.waybillId = data.waybillId;
            this.reservoirAreaShow = data.reservoirArea;
          } else {
            if (res.message){
              this.$message.error(res.message);
            }else{
              this.$message.error("操作失败");
            }
          }
        },
        error => {
          console.log(error);
          this.$message.error("请求内部发生异常");
        }
      );
    },
    async saveArrivalTotalPackages() {
      if (!this.waybillId) {
        this.$message.error("运单不存在");
        return;
      }
      if (!this.arrivalTotalPackages) {
        this.arrivalTotalPackages = this.customerCount;
      }else{
        if (this.customerCount&&parseInt(this.customerCount)<parseInt(this.arrivalTotalPackages)){
          this.$message.error("录入到仓件数之和不能大于下单件数")
          return;
        }
      }
      if(this.arrivalPackages&&this.customerCount&&parseInt(this.customerCount)<parseInt(this.arrivalTotalPackages)+parseInt(this.arrivalPackages)){
        Toast("录入到仓件数之和不能大于下单件数")
        return;
      }
      let res = await ajax("findByWarehouse", this.warehouseParam);
      console.log(res);
      if (res.code != 200 ) {
        return this.$message.error("您输入库区不存在！");
      }
      //后台不支持多个运单进行到仓，增加提示
      if(this.waybillId.length>1){
        return this.$message.error("该箱单存在多笔运单，暂不支持多笔保存。请使用九方箱号[规则：运单号-1]进行查询后编辑保存");
      }
      ajax("saveArrivalTotalPackages", {
        waybillId: this.waybillId[0],
        arrivalTotalPackages: this.arrivalTotalPackages,
        reservoirArea: this.warehouseParam.number,
        storageLocation: this.storageLocation,
        customerCount: this.customerCount
      }).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            this.$message.success("保存成功");
            this.queryAndprintWaybillLabel();
          }else {
              this.$message.error("操作失败"+res.message);
          }
        },
        error => {
          console.log(error);
          this.$message.error("请求内部发生异常");
        }
      );
    }
  }
};
</script>
<style scoped>
.info-box >>> .el-row {
  margin-bottom: 10px;
}
</style>
